<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
        <meta name="description" content="{{description}}">
        <meta name="custom-image" content="https://totemlife.cn/apps/public/avatar-3b-300x300.jpg">
        <title>{{title}}</title>
        <!-- 引入 WeUI CDN 链接 -->
        <link rel="stylesheet" href="/apps/css/weui.min-2.6.4.css"/>
        <script src="/apps/js/baidu-tongji-mtx.js"></script>
        <style>
            body{
                background-image: url('{{{background}}}');
                background-repeat: no-repeat; background-size: 100% 100%;
                background-position: center center; background-size: cover; -o-background-size: cover;
                -webkit-background-size: cover; -moz-background-size: cover;
                padding-bottom: 100px; min-height: 100vh; display: flex; flex-direction: column;
            };
            .page{ min-height: 100vh; }
            .weui-msg{ min-height: 100vh; background-color:rgb(255,255,255,0); }
        </style>
        <script src="/apps/js/baidu-tongji-mtx.js"></script>
    </head>
    <body>
        <div class="page">
            <div class="weui-msg">
                <!-- div class="weui-msg__icon-area"><i class="weui-icon-waiting weui-icon_msg" id="msgIcon"></i></div-->
                <div class="weui-msg__text-area">
                    <h2 class="weui-msg__title" {{{textStyle}}} id="msgTitle">{{message}}</h2>
                    <p class="weui-msg__desc" {{{textStyle}}} id="msgDescription">{{{description}}}</p>
                </div>
                <div class="weui-msg__tips-area">
                    <p class="weui-msg__tips" id="msgTips" {{{counterStyle}}} >
                        <span id="cdTitle" >离活动结束还剩</span><span id="countdown"></span>小时<span id="countdown-minutes"></span>分钟<span id="countdown-seconds"></span>秒
                    </p>
                </div>
                <div class="weui-msg__opr-area">
                    <p class="weui-btn-area">
                    <a id="bntLink" href="{{bntLink}}" role="button" class="weui-btn weui-btn_primary" {{{bntStyle}}}>{{bntName}}</a>
                    <a id="tmall-app-home-link" href="weixin://dl/business/?appid=wx1b441d1a37b278e1&path=pages/index/index&env_version=release" role="button" class="weui-btn weui-btn_default">
                        <span id="tmall-app-home-title">图腾生命医学</span>
                    </a>
                    <a href="https://totemlife.cn/apps/ai" role="button" class="weui-btn weui-btn_default">益生智库服务</a>
                    </p>
                </div>
                <div class="weui-msg__extra-area">
                    <div class="weui-footer">
                        <p class="weui-footer__links"> <a href="https://totemlife.cn/apps/contact-us" class="weui-wa-hotarea weui-footer__link" style="color:#ffffff">图腾生命医学 &copy; 2023</a> </p>
                        <p class="weui-footer__text" style="color:#ffffff">我们为人类免疫事业而奉献</p>
                    </div>
                </div>
            </div>
        </div>
        <script>
            const startTime = "{{startTime}}" || "2024-02-10T00:00:00";
            const stopTime = "{{stopTime}}" || "2024-02-15T23:59:59";
            const bntLink = "{{bntLink}}" || "#";
            function updateElement(id, value, attr = 'className') {
                if (value !== '') {
                    const element = document.getElementById(id);
                    if (attr === 'innerText') {
                        element.innerText = value;
                    } else {
                        element.className = value;
                    }
                }
            }

            function updateFinish() {
                document.getElementById("msgTips").innerHTML = "活动已结束，欢迎再来";
            };
            //updateFinish();

            function updateCountdown() {
                // 获取当前时间和目标时间（2023-09-25 20:23）
                const currentTime = new Date();
                const targetTime = currentTime < new Date(startTime) ? new Date(startTime) : new Date(stopTime);

                // 计算剩余时间（以秒为单位）
                const timeDifference = Math.floor((targetTime - currentTime) / 1000);
                document.getElementById("bntLink").href = bntLink;

                if (currentTime < new Date(startTime)) {
                    document.getElementById("cdTitle").textContent = '离活动开始还有';
                    document.getElementById("bntLink").href = bntLink;
                };

                if (currentTime >= new Date(startTime) && currentTime <= new Date(stopTime) ) {
                    document.getElementById("cdTitle").textContent = '离活动结束还有';
                    document.getElementById("bntLink").href = bntLink;
                };

                if (currentTime > new Date(stopTime)) {
                    document.getElementById("cdTitle").textContent = '离活动结束已过';
                };

                // 计算剩余的小时、分钟和秒
                const hours = Math.floor(timeDifference / 3600);
                const minutes = Math.floor((timeDifference % 3600) / 60);
                const seconds = timeDifference % 60;

                // 更新页面元素
                document.getElementById("countdown").textContent = hours;
                document.getElementById("countdown-minutes").textContent = minutes;
                document.getElementById("countdown-seconds").textContent = seconds;

                // 如果剩余时间大于0，继续倒计时；否则，停止倒计时
                if (timeDifference > 0) {
                    setTimeout(updateCountdown, 1000);
                } else {
                    // 活动已结束，更新提示
                    document.getElementById("msgTips").innerHTML = "活动已结束，欢迎再来";
                }

            }

            // 初始加载时更新一次
            updateCountdown();

            // 每秒钟更新一次
            setInterval(updateCountdown, 1000);
        </script>
        <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js" defer></script>
        <script src="/apps/js/wx-client-dom.js" defer></script>
    </body>
</html>
